<template>
<div class="contain">
  <div class="loader-base" v-if="showLoad"><div class="loader-wrap"></div></div>
  <header class="hd-top">
    <span class="iconfont icon-left" @click="goBack"></span>
    <h2 class="title">公司资料</h2>
    <button class="btn" @click="skip">跳过</button>
  </header>
  <div class="page">
    <div class="mb30">
      <div class="displayflex form-box">
        <div class="label">联系人</div>
        <div class="flex1 ctx"><input class="txt-rit" type="text" v-model="Contacts" placeholder="请输入"></div>
        <!-- <span class="iconfont icon-del" v-if="Contacts" @click="Contacts=''"></span> -->
      </div>
      <div class="displayflex form-box">
        <div class="label">联系电话</div>
        <div class="flex1 ctx"><input class="txt-rit" type="text" v-model="ContactTel" placeholder="请输入"></div>
        <!-- <span class="iconfont icon-del" v-if="ContactTel" @click="ContactTel=''"></span> -->
      </div>
      <div class="displayflex form-box">
        <div class="label">企业名称</div>
        <div class="flex1 ctx"><input class="txt-rit" type="text" v-model="cpyName" placeholder="请输入"></div>
        <!-- <span class="iconfont icon-del" v-if="cpyName" @click="cpyName=''"></span> -->
      </div>
      <div class="displayflex form-box">
        <div class="label">名称缩写</div>
        <div class="flex1 ctx"><input class="txt-rit" type="text" v-model="cpyAbbr" placeholder="请输入"></div>
        <!-- <span class="iconfont icon-del" v-if="cpyAbbr" @click="cpyAbbr=''"></span> -->
      </div>
      <div class="displayflex form-box mb0 lineb">
        <x-address class="address-wrap" title="省市区" v-model="addressValue" :list="addressData" placeholder="请选择" value-text-align="right">
        </x-address>
        <i class="iconfont icon-right"></i>
        <div class="txt-rit" id="addressChinese" style="display:none">{{addressValue[0] | province}}/{{addressValue[1] | city}}/{{addressValue[2] | district}}</div>
      </div>
      <div class="displayflex form-box">
        <div class="label">详细地址</div>
        <div class="flex1 ctx">
          <textarea placeholder="请输入" v-model="cpyAddress"></textarea>
        </div>
        <!-- <div class="flex1 ctx"><input class="txt-rit" type="text" v-model="cpyAddress"></div>
        <span class="iconfont icon-del" v-if="cpyAddress" @click="cpyAddress=''"></span> -->
      </div>
    </div>
    <template>
      <uploader-img :word="'营业执照'" :max="1" v-model="picJsonYY" :list="picJsonYY" :editflag="edit"></uploader-img>
    </template>
    <!--<div class="form-wrap2 mb30">
      <p class="txt">营业执照正面照<p>
      <div class="camera-wrap" @click="getImg">
        <i class="iconfont icon-add" v-if="!imgLista"></i>
        <img v-else :src="imgLista" style="width:100%; height:auto; margin-top:-1rem;"/>
        <div class="footer"><i class="iconfont icon-camera"></i>上传营业执照</div>
      </div>
    </div>-->
  </div>
  <!-- <div class="btn-bottom">
    <button class="btn btn-default btn-click" @click="sure">提 交</button>
  </div> -->
  <div class="btn-double displayflex">
    <div class="flex1" @click="skip">跳过</div>
    <div class="flex1" @click="sure">提交</div>
  </div>
</div>
</template>
<script>
import uploaderImg from '@/components/share/uploader.vue';
export default {
  components:{
    uploaderImg,
  },
  data(){
    return {
      Contacts:'',
      ContactTel:'',
      cpyName:'',
      cpyAbbr:'',
      cpyAddress:'',
      addressValue:[],
      addressData: this.ChinaAddressV3Data,
      edit:true,
      //图片
      // imgRaw: null,
      // imgListBase: [],
      // imgLista: null,
      picJsonYY:{
        imgLista: [],
        imgListBase: []
      },

      //加载标识
      showLoad: false,
      
    }
  },
  computed:{
    userinfo(){
      if(localStorage.UserInfo){
        return JSON.parse(localStorage.UserInfo)
      };
    }
  },
  methods:{
    goBack(){
      this.$router.go(-1);
    },
    skip(){
      this.showLoad = true;
      var name = this.userinfo.Name == null? this.userinfo.LogonUser:this.userinfo.Name;
      var _this = this;
      var query = {
        LoginedStaffID: this.userinfo.StaffID,
        LoginedName:name,
      }
      this.Ajax.post('SkipCargownerData', query).then(function(resp){
        _this.showLoad = false;
        if(resp.IsSuccess)
        {
          _this.clear(2);
          _this.$router.push({
            path:'/index'
          });
        }
        else
        {
          _this.$vux.toast.show({
            type:'warn',//success, warn, cancel, text
            text: resp.ErrorMessage,
          });
        }
      });
    },

    //提交
    sure(){
      var _this = this;
      if(!this.Contacts){
        this.$vux.toast.show({
          type:'warn',//success, warn, cancel, text
          text: '联系人姓名不能为空'
        })
        return false;
      };
      if(!this.ContactTel){
        this.$vux.toast.show({
          type:'warn',//success, warn, cancel, text
          text: '联系人电话不能为空'
        })
        return false;
      };
      if(!this.cpyName){
        this.$vux.toast.show({
          type:'warn',//success, warn, cancel, text
          text: '请填写公司名称'
        })
        return false;
      };
      if(!this.cpyAbbr){
        this.$vux.toast.show({
          type:'warn',//success, warn, cancel, text
          text: '请填写公司缩写'
        })
        return false;
      };
      if(this.addressValue.length == 0){
        this.$vux.toast.show({
          type:'warn',//success, warn, cancel, text
          text: '请选择所在省市区信息'
        })
        return false;
      };
      if(!this.cpyAddress){
        this.$vux.toast.show({
          type:'warn',//success, warn, cancel, text
          text: '请填写详细地址'
        })
        return false;
      };
      if(this.picJsonYY.imgListBase.length == 0){
        this.$vux.toast.show({
          type:'warn',//success, warn, cancel, text
          text: '请上传营业执照图片'
        })
        return false;
      };
      this.showLoad = true;
      
      var query = {
        Contacts: this.Contacts,
        ContactTel: this.ContactTel,
        ChineseName:this.cpyName,
        Abbreviation:this.cpyAbbr,
        AreaFullText:document.getElementById('addressChinese').innerHTML,
        Province:this.addressValue[0],
        City:this.addressValue[1],
        District:this.addressValue[2],
        Address:this.cpyAddress,
        imgurla:this.picJsonYY.imgListBase,
        LoginedStaffID: this.userinfo.StaffID,
        LoginedName: this.userinfo.Name,
      };

      this.Ajax.post('CargoOwnerLicense', query).then(function(resp){
        _this.showLoad = false;
        if(resp.IsSuccess) {
          _this.clear();
        } else {
          _this.$vux.toast.show({
            type:'warn',//success, warn, cancel, text
            text: '未知错误',
          });
        }
      });
    },
    clear(type){
      var _this = this,
          userinfo = JSON.parse(localStorage.UserInfo),
          query = {
            LogonUser:userinfo.LogonUser,
            Pwd:userinfo.Pwd,
            reLogin: 'Y',
          };
      //清除
      sessionStorage.clear();
      localStorage.clear();
      //重加载
      this.Ajax.post('UserLogin', query).then(function(resp) {
        if (resp.IsSuccess) {
          localStorage.UserInfo = JSON.stringify(resp.Data);
          if(type == 2)
          {
            _this.$router.push({
              path:'/index'
            });
          }
          else
          {
            _this.$vux.toast.show({
              type:'text',//success, warn, cancel, text
              text: '资料保存完成',
              onHide(){
                _this.$router.push({
                  path:'/index'
                });
              }
            });
          }
        } else {
          _this.$vux.toast.show({
            type:'warn',//success, warn, cancel, text
            text: "缓存操作失败，请重新登录",
            onHide(){
              _this.$router.push({
                path:'/login'
              });
            }
          });
        };
      });
    },
  }
}
</script>